<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

      


        <ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                        
                        xmlns:f="http://java.sun.com/jsf/core"
                        xmlns:h="http://java.sun.com/jsf/html"
                        xmlns:p="http://primefaces.org/ui">>           

      
                <f:view>
                    <h:form id="form" enctype="multipart/form-data" >
                        <p:growl id="msgs" showDetail="true" />
                        
                        <p:dataTable id="user" value="#{userControl.allUser}" var="item" paginator="true" rows="5" tableStyle="width:auto" widgetVar="carsTable" emptyMessage="No Event found with given criteria" scrollable="true" scrollWidth="750">                                                              
                            <f:facet name="header">  
                                <p:outputPanel>  
                                <h:outputText value="Search all fields:" />  
                                <p:inputText id="globalFilter" onkeyup="carsTable.filter()" style="width:150px" />  
                                </p:outputPanel>
                            </f:facet>
                            <p:column headerText="Avata">                                
                            <a href="#"><img src="#{item.avatar}" height="100" width="70" /> </a>
                        </p:column>
                            <p:column filterBy="#{item.userName}" sortBy="#{item.userName}" headerText="UserName" footerText="contains" filterMatchMode="contains" >               
                            <h:outputText value="#{item.userName}"/>
                        </p:column>
                            <p:column filterBy="#{userControl.convertSex(item)}"  sortBy="#{userControl.convertSex(item)}" headerText="Gender" footerText="Exact" filterOptions="#{userControl.sexoption()}" filterMatchMode="exact">                                
                                <h:outputText value="#{userControl.convertSex(item)}"/>
                        </p:column>
                        <p:column headerText="FullName">                                
                            <h:outputText value="#{item.fullName}"/>
                        </p:column>
                        <p:column headerText="Birthday">                                
                            <h:outputText value="#{item.birthday}">
                                <f:convertDateTime pattern="MM/dd/yyyy" />
                            </h:outputText>
                        </p:column>
                        <p:column filterBy="#{item.phone}" sortBy="#{item.phone}" headerText="Phone Number" footerText="contains" filterMatchMode="contains" >                                
                            <h:outputText value="#{item.phone}"/>
                        </p:column>
                        <p:column headerText="Address">                                
                            <h:outputText value="#{item.address}"/>
                        </p:column>
                        <p:column headerText="Email">                                
                            <h:outputText value="#{item.email}"/>
                        </p:column>
                            <p:column filterBy="#{item.departmentName}" sortBy="#{item.departmentName}" headerText="Department" footerText="Exact" filterOptions="#{userControl.createFilterOptions()}" filterMatchMode="exact">                                
                            <h:outputText value="#{item.departmentName}"/>
                        </p:column>                       
                        </p:dataTable>
                        
                    </h:form>
                </f:view>


        </ui:composition>

 
